<template>
    <div class="search">
      <DetailHead @search="handleSearch"></DetailHead>
      <MainSearch :searchKeyword="searchKeyword" :subjectId="subjectId"></MainSearch>
      <FootView></FootView>
    </div>
  </template>
  <script>
  // @ is an alias to /src
  import DetailHead from '@/components/DetailHead.vue'
  import MainSearch from './components/MainSearch.vue';
  import FootView from '@/components/FootView.vue'
  export default {
    name: 'SearchView',
    components: {
      DetailHead,
      MainSearch,
      FootView
    },
    data() {
      return {
        searchKeyword: ''
      }
    },
    computed: {
      subjectId() {
        return this.$route.query.subjectId || ''
      }
    },
    methods: {
      handleSearch(keyword) {
        this.searchKeyword = keyword;
      }
    }
  }
  </script>
  
  